<template>
	<!-- 图标文字样式组件 -->
	<div class="fpopup flexcent" @click="close">
		<div class="content" @click.stop.prevent="nullcolse">
			<!-- 头部内容 -->
			<div class="popuphead flexspb">
				<div class="iconfont"></div>
				<!-- 标题内容 -->
				<div class="title">{{title}}</div>
				<!-- 关闭图标 -->
				<div @click="close" v-if="isclose" class="iconfont icon-close"></div>
			</div>
			<!-- 内容 -->
			<slot></slot>
		</div>
	</div>
</template>

<script>
	export default {
		name: 'fpopup', //新闻资讯
		props: {
			title: { //弹窗标题
				type: String
			},
			//是否显示关闭按钮
			isclose:{
				type: Boolean,
				default: false
			}
		},
		methods: {
			// 
			nullcolse() {},
			// 关闭弹窗事件
			close() {
				this.$emit('close')
			}
		}
	}
</script>

<style lang="less" scoped>
	// 新闻资讯
	.fpopup {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: #00000060;
		z-index: 300;

		// 内容模块
		.content {
			border-radius: 20rpx;
			padding: 30rpx;
			background-color: #ffffff;

			// 头部内容
			.popuphead {
				font-size: 28rpx;

				// 标题内容
				.title {
					flex: 1;
					text-align: center;
					margin: 0 50rpx;
				}

				// 关闭图标
				.icon-close {
					color: #797979;
					font-size: 32rpx;
				}
			}
		}
	}
</style>